<!DOCTYPE html>
<html>
<head>
    {include file="public/header" /}
    <style>
        .top-panel {
            border: 1px solid #eceff9;
            border-radius: 5px;
            text-align: center;
        }

        .top-panel > .layui-card-body {
            height: 60px;
        }
    </style>
</head>
<body>
<div class="layuimini-main">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-xs12 layui-col-md12">
            <fieldset class="table-search-fieldset">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-inline" style="margin-left: 10%">
                        <label class="layui-form-label">时间筛选</label>
                        <div class="layui-input-inline">
                            <input type="text" name="searchTime_min" id="searchTime_min" placeholder="请选择日期" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </form>
                <div id="Earnings_trend" style="background-color:#ffffff;min-height:500px;padding: 10px"></div>
            </fieldset>
        </div>
    </div>


</div>
<!--</div>-->
{include file="public/footer" /}
<script>
    layui.use(['layer', 'echarts', 'laydate'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            laydate = layui.laydate,
            echarts = layui.echarts;
        /*时间-最小*/
        laydate.render({
            elem: '#searchTime_min',
            type: 'date',
            done(value, date) {
                $('#searchTime_min').val(value);
                getData();
            }
        });
        /*每日统计*/
        var Earnings_trend = echarts.init(document.getElementById('Earnings_trend'), 'walden');
        getData();

        /*数据加载*/
        function getData() {
            var min = $('#searchTime_min').val();
            var incomeTypeData;
            $.ajax({
                url: '/admin/PlatformData/downloadInfo?action=ajax',
                type: 'post',
                dataType: 'json',
                async: false,
                data: {min: min},
                success: function (res) {
                    if (res.status == true) {
                        // 关闭弹出层
                        incomeTypeData = res.data;
                        earningsTrend(res.dailyDataCount, res.dailyData)
                    } else {
                        layer.msg(res.msg);
                    }
                },
                error: function () {
                    layer.msg("报错了");
                }
            });
            return false;
        }

        /*图形加载*/
        function earningsTrend(dailyDataCount, dailyData) {
            var option_Earnings_trend = {
                title: {
                    text: '今日下载量：' + dailyDataCount,
                    textStyle: {
                        color: 'red',
                    },
                    padding: [0, 0, 10, 100]  // 位置
                },
                legend: {},
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'shadow'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                toolbox: {
                    feature: {
                        saveAsImage: {}
                    }
                },
                xAxis: {
                    type: 'category',
                    data: ['1:00', '2:00', '3:00', '4:00', '5:00', '6:00', '7:00', '8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00', '24:00']
                },
                yAxis: {
                    type: 'value',
                },
                series: [
                    {
                        name: '下载总数',
                        type: 'line',
                        data: dailyData,
                    },
                ]
            };
            Earnings_trend.setOption(option_Earnings_trend);
        }

        // echarts 窗口缩放自适应
        window.onresize = function () {
            Earnings_trend.resize();
        }

    });
</script>
</body>
</html>
